<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<script src="../js/vue.js" type="text/javascript" charset="utf-8"></script>
	</head>
	<body>
		<!-- 定义一个容器 -->
		<div id="box">
		<h1>学校名：{{name}}</h1>
		<h1>学校地址：{{address}}</h1>
		</div>
	
		<script type="text/javascript">
			Vue.config.productionTip=false//阻止 vue 在启动时生成生产提示
			//第一点，我们需要明确,按照正常的对象访问，我们应该是vm.data.name的形式，但是vue通过数据代理的形式，将vm.data中的内容通过get和set放入vue实例身上了，这一点与谢书琳做的，通过stu1来控制stu2的值，是类似的道理
			//其次，data中定义的属性，我们都可以通过vue实例来访问，即vm.name
			//最后，为什么我们直接访问vm.data无效呢，这里vue实例做了一个数据劫持，这一点以后再说。
			// 创建一个vue实例
			let vm=new Vue({
				el:'#box',
				data:{
					// name:'宜春职院1',
					// address:'江西宜春'
					name:'宜春职院1',
					address:'江西宜春'
				}
			})
		</script>
	</body>
</html>